<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<c:choose>
	<c:when test="${currentArticle != null }">
		<meta content="${currentArticle.keyword }" name="keywords">
		<meta content="${currentArticle.name }" name="description">
	</c:when>
	<c:when test="${currentProduct != null }">
		<meta content="${currentProduct.keyword }" name="keywords">
		<meta content="${currentProduct.name }" name="description">
	</c:when>
	<c:when test="${aboutUs != null }">
		<meta content="${currentProduct.keyword }" name="keywords">
		<meta content="${currentProduct.name }" name="description">
	</c:when>
	<c:when test="${contact != null }">
		<meta content="${contact.keyword }" name="keywords">
		<meta content="${contact.name }" name="description">
	</c:when>

	<c:when test="${not empty productGroup}">
		<jsp:useBean id="random" class="java.util.Random" scope="application" />
		<meta content="${productGroup[random.nextInt(productGroup.size())].keyword }" name="keywords">
		<meta content="${productGroup[random.nextInt(productGroup.size())].name }" name="description">
	</c:when>
	<c:otherwise>
		<meta content="quochuymart.vn" name="keywords">
		<meta content="quoc huy mart" name="description">
	</c:otherwise>
</c:choose>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<c:choose>
	<c:when test="${pageTitle!=null}">
		<title>${pageTitle}</title>
	</c:when>
	<c:otherwise>
		<title><tiles:insertAttribute name="title" ignore="true" /></title>
	</c:otherwise>
</c:choose>

<link rel="shortcut icon" href="<c:url value="/images/favicon.ico"/>" type="image/x-icon">
<link href="<c:url value="/css/screen.css"/>" type="text/css" rel="stylesheet">
<link href="<c:url value="/css/social.css"/>" type="text/css" rel="stylesheet">
<script type="text/javascript" src="<c:url value="/js/jquery.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/common.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/swfobject.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/nivo.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/global.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/screen.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/popup.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/lightbox.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/colorbox.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/jquery.elevatezoom.js"/>"></script>
</head>

<body>
	<!--  share button-->
	<div id="share-wrapper">
		<ul class="share-inner-wrp">
			<!-- Facebook -->
			<li class="facebook button-wrap"><a href="#">Facebook</a></li>

			<!-- Twitter -->
			<li class="twitter button-wrap"><a href="#">Tweet</a></li>

			<!-- Digg -->
			<li class="digg button-wrap"><a href="#">Digg it</a></li>

			<!-- Stumbleupon -->
			<li class="stumbleupon button-wrap"><a href="#">Stumbleupon</a></li>

			<!-- Delicious -->
			<li class="delicious button-wrap"><a href="#">Delicious</a></li>

			<!-- Google -->
			<li class="google button-wrap"><a href="#">Plus Share</a></li>

			<!-- Email -->
			<li class="email button-wrap"><a href="#">Email</a></li>
		</ul>
	</div>
	<div class="bdw">
		<!----start-wrap---->
		<!----start-top-header----->
		<div class="hdr">
			<tiles:insertAttribute name="top-header" />
		</div>
		<!----//End-top-header----->

		<div class="mc">
			<ul class="ul mc">
				<li class="mcl"><tiles:insertAttribute name="left-menu" /></li>
				<li class="mcr"><tiles:insertAttribute name="slider" />
					<div class="clear10px"></div> <tiles:insertAttribute name="body" /></li>
			</ul>
			<div style="clear: both"></div>
		</div>
		<!----start-footer---->
		<div class="footer" <c:if test="${not empty footers }">style="background-image: url('<c:url value="loadImage.html?type=FULL&fileId=${footers[0].id}"/>')" </c:if>>
			<div class="fCols">
				<tiles:insertAttribute name="sub-footer" />
			</div>
			<div style="clear: both"></div>
			<tiles:insertAttribute name="footer" />
		</div>
		<!----//End-footer---->

		<!----//End-wrap---->
	</div>

	<script type="text/javascript">
		$(document)
				.ready(
						function() {
							var pageTitle = document.title; //HTML page title
							var pageUrl = location.href; //Location of the page

							//user hovers on the share button	
							$('#share-wrapper li').hover(function() {
								var hoverEl = $(this); //get element

								//browsers with width > 699 get button slide effect
								if ($(window).width() > 699) {
									if (hoverEl.hasClass('visible')) {
										hoverEl.animate({
											"margin-left" : "-117px"
										}, "fast").removeClass('visible');
									} else {
										hoverEl.animate({
											"margin-left" : "0px"
										}, "fast").addClass('visible');
									}
								}
							});

							//user clicks on a share button
							$('.button-wrap')
									.click(
											function(event) {
												var shareName = $(this).attr(
														'class').split(' ')[0]; //get the first class name of clicked element

												switch (shareName) //switch to different links based on different social name
												{
												case 'facebook':
													var openLink = 'https://www.facebook.com/sharer/sharer.php?u='
															+ encodeURIComponent(pageUrl)
															+ '&amp;title='
															+ encodeURIComponent(pageTitle);
													break;
												case 'twitter':
													var openLink = 'http://twitter.com/home?status='
															+ encodeURIComponent(pageTitle
																	+ ' '
																	+ pageUrl);
													break;
												case 'digg':
													var openLink = 'http://www.digg.com/submit?phase=2&amp;url='
															+ encodeURIComponent(pageUrl)
															+ '&amp;title='
															+ encodeURIComponent(pageTitle);
													break;
												case 'stumbleupon':
													var openLink = 'http://www.stumbleupon.com/submit?url='
															+ encodeURIComponent(pageUrl)
															+ '&amp;title='
															+ encodeURIComponent(pageTitle);
													break;
												case 'delicious':
													var openLink = 'http://del.icio.us/post?url='
															+ encodeURIComponent(pageUrl)
															+ '&amp;title='
															+ encodeURIComponent(pageTitle);
													break;
												case 'google':
													var openLink = 'https://plus.google.com/share?url='
															+ encodeURIComponent(pageUrl)
															+ '&amp;title='
															+ encodeURIComponent(pageTitle);
													break;
												case 'email':
													var openLink = 'mailto:?subject='
															+ pageTitle
															+ '&body=Found this useful link for you : '
															+ pageUrl;
													break;
												}

												//Parameters for the Popup window
												winWidth = 650;
												winHeight = 450;
														winLeft = ($(window)
																.width() - winWidth) / 2,
														winTop = ($(window)
																.height() - winHeight) / 2,
														winOptions = 'width='
																+ winWidth
																+ ',height='
																+ winHeight
																+ ',top='
																+ winTop
																+ ',left='
																+ winLeft;

												//open Popup window and redirect user to share website.
												window.open(openLink,
														'Share This Link',
														winOptions);
												return false;
											});
						});
	</script>
</body>
</html>